<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="icon" type="image/x-icon" href="../../images/logo.png">
    <title>景区产品监测</title>
    <!-- 下拉框 -->
    <link rel="stylesheet" href="../../plugin/M_select/js/M_select/M_select.css">
    <link rel="stylesheet" href="../../css/reset.css">
    <link rel="stylesheet" href="../../css/common.css">
    <link rel="stylesheet" href="../../css/hotelProducts.css">
</head>

<body>
    <div class="box">
        <!-- 头部 -->
        <div class="header-box">
                <img src="../../images/headeBg.png" alt="">
                <div class="weather-box">
                    <span>郑州 小雨转多云 32/16℃</span>
                </div>
                <h1 class="header-title"><img src="../../images/header.png" alt=""></h1>
                <div class="header-action">
                    <span class="action-time"></span>
                    <a href="javascript:;">管理中心</a>
                    <a href="javascript:;">退出</a>
                </div>
            </div>
        <div class="main-box">
            <!-- 侧边导航 -->
            <ul class="aside-box">
                <li>
                    <a href="../home.html">
                        <span>
                            <img class="aside-img" src="../../images/home.png" alt="">
                            <img class="aside-imgA " src="../../images/homeA.png" alt="">
                            首页
                        </span>
                    </a>
                </li>
                <li>
                    <a href="../surroundings/development.html">
                        <span>
                            <img class="aside-img" src="../../images/huanjing.png" alt="">
                            <img class="aside-imgA" src="../../images/huanjingA.png" alt="">
                            产业发展环境
                        </span>
                    </a>
                </li>
                <li>
                    <a href="../basic/basic.html">
                        <span>
                            <img class="aside-img" src="../../images/yaosu.png" alt="">
                            <img class="aside-imgA" src="../../images/yaosuA.png" alt="">
                            产业基础要素
                        </span>
                    </a>
                </li>
                <li>
                    <a href="../passengerFlow/destination.html">
                        <span>
                            <img class="aside-img" src="../../images/keliu.png" alt="">
                            <img class="aside-imgA" src="../../images/keliuA.png" alt="">
                            旅游客流监测
                        </span>
                    </a>
                </li>
                <li class="active">
                    <a href="./index.html">
                        <span>
                            <img class="aside-img" src="../../images/chanpin.png" alt="">
                            <img class="aside-imgA" src="../../images/chanpinA.png" alt="">
                            旅游产品监测
                        </span>
                    </a>
                </li>
                <li>
                    <a href="../enterprise/scenicMonitor.html">
                        <span>
                            <img class="aside-img" src="../../images/qiye.png" alt="">
                            <img class="aside-imgA" src="../../images/qiyeA.png" alt="">
                            旅游企业监测
                        </span>
                    </a>
                </li>
                <li>
                    <a href="../tourismProject/index.html">
                        <span>
                            <img class="aside-img" src="../../images/xiangmu.png" alt="">
                            <img class="aside-imgA" src="../../images/xiangmuA.png" alt="">
                            旅游项目监测
                        </span>
                    </a>
                </li>
                <li>
                    <a href="../brand/brand.html">
                        <span>
                            <img class="aside-img" src="../../images/pinpai.png" alt="">
                            <img class="aside-imgA" src="../../images/pinpaiA.png" alt="">
                            旅游品牌监测
                        </span>
                    </a>
                </li>
            </ul>
            <!-- 主题内容 -->
            <div class="content-box">

                <div class="content-nav-box">
                    <a class="active" href="#">景区产品监测 </a>
                    <a href="hotelProducts.html">酒店产品监测</a>
                    <a href="travelAgencyProducts.html">旅行社产品监测</a>
                </div>
                <div class="select-box">
                    <div data-toggle="distpicker" id="distpicker3">
                        <select></select>
                        <select></select>
                    </div>
                    <div>
                        <select name="" id="">
                            <option value="">5A景区</option>
                            <option value="">4A景区</option>
                            <option value="">3A景区</option>
                            <option value="">2A景区</option>
                        </select>
                    </div>
                    <div>
                        <input type="text" id="dateSelect" placeholder="请选择日期">
                    </div>
                    <div class="search-box">
                        <input type="search" value="成人票">
                        <button>产品搜索</button>
                    </div>
                </div>
                <div class="main-content-box">
                    <div class="left-box">
                        <div>
                            <div class="title-box">
                                <h3>
                                    <img src="../../images/titile-img.png">
                                    价格分析
                                </h3>
                            </div>
                            <div class="echarts-box" id="price"></div>
                        </div>
                        <div>
                            <div class="title-box">
                                <h3>
                                    <img src="../../images/titile-img.png">
                                    7天价格预测
                                </h3>
                            </div>
                            <div class="echarts-box" id="priceForecast"></div>
                        </div>
                    </div>
                    <div class="mid-box">
                        <div>
                            <div class="num-box">
                                <p>在线产品数量 </p>
<!--                                <i>-->
<!--                                    <span>0</span>-->
<!--                                    <span>4</span>-->
<!--                                    <span>7</span>-->
<!--                                    <span>5</span>-->
<!--                                    <span>2</span>-->
<!--                                </i>-->
                              <div class="numberStyle">04852</div>
                            </div>
                            <div class="chart">
                                <div class="title-box">
                                    <h3>
                                        <img src="../../images/titile-img.png">
                                        产品数量分析
                                    </h3>
                                </div>
                                <div class="echarts-box" id="product"></div>
                            </div>

                        </div>
                        <div>
                            <div class="title-box">
                                <h3>
                                    <img src="../../images/titile-img.png">
                                    评价分析
                                </h3>
                            </div>
                            <div class="echarts-box" id="evaluation"></div>
                        </div>
                    </div>
                    <div class="right-box">
                        <div>
                            <div class="title-box">
                                <h3>
                                    <img src="../../images/titile-img.png">
                                    销售渠道分布
                                </h3>
                            </div>
                            <div class="echarts-box" id="channel"></div>
                        </div>
                        <div>
                            <div class="title-box">
                                <h3>
                                    <img src="../../images/titile-img.png">
                                    销量分析
                                </h3>
                            </div>
                            <div class="echarts-box" id="volume"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<script src="../../plugin/jquery-1.11.1.min.js"></script>
<script src="../../plugin/ECharts/echarts.js"></script>
<!-- 省市 -->
<script src="../../plugin/jQueryProvinces/distpicker.data.js"></script>
<script src="../../plugin/jQueryProvinces/distpicker.js"></script>
<!-- 时间 -->
<script src="../../plugin/laydate/laydate.js"></script>
<script src="../../js/common.js"></script>
<script src='../../js/hotelProducts.js'></script>
<script src="../../js/jquery.leoTextAnimate.js"></script>
<script>
    $("#distpicker3").distpicker({
        province: "河南省",
        city: "郑州市",
    });
    laydate.render({
        elem: '#dateSelect',
        range: true
    });
    $('.numberStyle').leoTextAnimate({
      delay: 1000, //延时出现时间
      autorun: true, //是否自动运行
      fixed: [',', ':', '.'], //
      start: '0'
    });
</script>

</html>
